<div class="e2e-loading">

<ion-header>

  <ion-navbar>
    <ion-title>Loading</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>

  <button ion-button block (click)="presentLoadingIos()">iOS Spinner</button>
  <button ion-button block (click)="presentLoadingDots()">Dots Spinner</button>
  <button ion-button block (click)="presentLoadingBubbles()">Bubbles Spinner</button>
  <button ion-button block (click)="presentLoadingCircles()">Circles Spinner</button>
  <button ion-button block (click)="presentLoadingCrescent()">Crescent Spinner</button>
  <button ion-button block (click)="presentLoadingDefault()" color="secondary" class="e2eLoadingDefaultSpinner">Default Spinner</button>
  <button ion-button block (click)="presentLoadingCustom()" color="light">Custom Spinner</button>
  <button ion-button block (click)="presentLoadingText()" color="dark">Content Only w/ Nav</button>
  <button ion-button block (click)="presentLoadingMultiple()" color="danger">Multiple Loading</button>
  <button ion-button block (click)="presentLoadingMultipleNav()" color="danger">Multiple Nav Loading</button>

</ion-content>


<ion-footer>

  <ion-toolbar>
    <ion-buttons end>
      <button ion-button icon-right (click)="goToPage2()">
        Navigate
        <ion-icon name="arrow-forward"></ion-icon>
      </button>
    </ion-buttons>
  </ion-toolbar>

</ion-footer>

</div>
